<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    Promise .then的放入【微队列】（等待执行）的两个条件：既要有下一个.then的回调函数（resolve，reject），还要有前一个的状态pending——》改变
    then里执行完，若果没有return  默认返回return underfined，状态成功，如果抛出错误，默认任何返回underfined，状态失败。如果返回new Promise函数，
    那么下一个.then执行之前，要等待Promise状态有了改变后，再执行，否则中断。
    <script>
        /*

        宏：[]
        微：[]

        */
      new Promise((resolve,reject)=>{
        resolve('foo')
      })
      .then(function(string) {
        new Promise(function(resolve, reject) {
          setTimeout(function() {   //宏任务1   
            string += 'bar';
            console.log(string);        //return stringbar
            resolve(string)
          }, 1000);
        });
      })
      .then(function(string) {     // stringbar

        setTimeout(function() {    //宏任务2
          string += 'baz';
          console.log(string);      //stringbar+baz
        }, 1000)
        return string;              //stringbar
      })
       
      .then(function(string) {
        console.log("Last Then:  oops... didn't bother to instantiate and return " +
                    "a promise in the prior then so the sequence may be a bit " +
                    "surprising");
     
        console.log(string);        // stringbar
      });




            // //首先第一个宏任务执行完，promise的状态改变后（stringbar），下一个.then进入微队列，
            //发现微队列有个定时器，放入宏队列等待所有微任务执行完，再执行。低三个.then执行，接受传进来的
            //stringbar，输出两个config，此时，微任务全部执行完，开始执行宏任务2；

                //    "Last Then:  oops... didn't bother to instantiate and return " +
               //     "a promise in the prior then so the sequence may be a bit " +
               //     "surprising"

                 //   underfined

                 //   stringbar

                 //underfinedbaz

              







        /* 
        1,7，2，3，8，4,6,88,5,55，0
        宏：[]
        微：[]
        */
        // setTimeout(()=>{console.log("0")},0)
        // new Promise((resolve,reject)=>{
        //     console.log('1')
        //     resolve()
        // }).then((value)=>{
        //     console.log('2');
        //     new Promise((resolve,reject)=>{
        //         console.log('3');
        //         resolve()
        //        //reject() 
        //     }).then((value)=>{
        //         console.log(`4`);
        //     })
        //     .then(()=>{
        //         console.log(`5`);
        //     }).then(()=>{
        //         console.log(`55`);
        //     })
        // }).then(()=>{
        //     console.log('6');
        // })

        // new Promise((resolve,reject)=>{
        //     console.log('7');
        //     resolve()
        // }).then(()=>{
        //     console.log(`8`);
        // }).then(()=>{
        //     console.log(`88`);
        // })
        
      
    
        // new Promise((resolve,reject)=>{
        //              resolve(1)
        //           //reject(1)
        //            // throw 1
        //         //    return 111   
        //         })
        //     .then((v)=>{console.log("value1:",v)})
        //     .then((v)=>{console.log('value2:',v)})
        //     .then((v)=>{console.log('value3:',v)})
        //     .then((v)=>{
        //         setTimeout(()=>{console.log('value4:',v)},3000)
        //     })
        //     .then((v)=>{console.log('value5:',v)})
        //     .then((v)=>{console.log('value6:',v)})
        //     .catch((res)=>{console.log(res)})
            
            
        /*    
            宏：[]
            微：[1]

        */
    </script>
</body>
</html>